<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <script type="text/javascript" src="../../js/vue.js"></script>
</head>
<body>
  <div id="root">
    <h2>今天天气很{{info}}</h2>
    <button @click="isHot = !isHot">切换天气</button>
    <!--绑定事件时,@xxx="yyy",yyy可以写一些简单的句子-->
    <button @click="changeWeather">切换天气</button>
    <button @click="window.alert(1)">alert</button>
  </div>

  <script type="text/javascript">
    var vm = new Vue({
      el:"#root",
      data:{
        isHot:true,
        x:1,
        window:window
      },
      computed:{
        info(){
          return this.isHot?'炎热':'凉爽';
        }
      },
      methods:{
        changeWeather(){
          this.isHot=!this.isHot
        }
      }
    });
  </script>

</body>
</html>
